<template>
 <van-sticky>
       
       <van-row type="flex" align="center" class="L-search-bar">
         <!-- <van-col :span="2" class="L-text-align-center" @click="hanldeClickFilter">
             <i class="iconfont icon-dingwei L-big-text"></i>     
         </van-col> -->
        
         <van-col :span="17">
           <van-search v-model="keyword" placeholder="请输入搜索关键词" />
         </van-col>
         <van-col :span="2" class="L-text-align-center" @click="handleClickSearch">搜索</van-col>
         <van-col :span="3" class="L-text-align-center" @click="hanldeClickFilter">
             筛选
         </van-col>
         
        
         <van-col :span="2" class="L-text-align-center" @click="hanldeSelectIcon">
             <i class="iconfont icon-xuanze2"></i>
         </van-col>
       </van-row>
     </van-sticky>
</template>

<script setup lang="ts">
import { getCurrentInstance } from 'vue';
 

import {defineProps,onMounted,ref,defineEmits,watch} from 'vue'

import emitter from "@/utils/emitter";

const keyword = ref("")

const props = defineProps({
    showPopup:Boolean,
    viewoptionArr:Array,
    isShowFilter:Boolean
})


const emit = defineEmits(['hanldeClickFilter','handleClickViewOption','handleClickSearch','handleInputSearch',"hanldeSelectIcon"]);

onMounted(()=>{

})

watch(keyword,(value)=>{
  emit("handleInputSearch",value)

})


function handleClickSearch(){
    emit('handleClickSearch',keyword.value)
}

function hanldeClickFilter(){
    emit('hanldeClickFilter',!props.isShowFilter)
}
function handleClickViewOption(){
    emit('handleClickViewOption',true)
}

function handleSearch(){
    emitter.emit('handleSearch',true)
}

function hanldeSelectIcon(){
    emit("hanldeSelectIcon")
}





</script>

<style scoped>

</style>